import React, {Component} from 'react';
import '../css/successfuleCase.css';
import {Consumer} from "../store";
import { project} from "../value";
import app from '../appMethod';
import $ from "jquery";

class SuccessfulCase extends Component {
    constructor(props) {
        super(props);
        this.state = {
            project_name:'',
            detailContainer:''
        };
    }

    render() {
        const {project_name}=this.state;
        return (
            <div style={{overflow: 'hidden'}}>
                <div className="successfulCaseHeader">
                </div>
                <div className="caseListContainer">
                    <div className="normalContainer">
                        <div className={"newsList"}>
                            <div className={"normalContainer"}>
                                <div className={"newsDetailTitle"}>{project_name}</div>
                                <div id={"detailContainer"} dangerouslySetInnerHTML={{__html: this.state.detailContainer}}></div>
                                <div className={"loadMore"} onClick={()=>this.handleRedirect()}>返回</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        )
    };

    componentDidMount() {
        const {dispatch} =this.props;
        dispatch({num:3});
        $(document).scrollTop(0);
        this.searchProjectById();
    };

    componentWillUnmount() {
        this.setState = (count, callback) => {
            return;
        }
    }

    /**
     * 根据项目Id查找项目详情
     * @param param
     */
    searchProjectById() {
        let _this = this;
        const project_id=this.props.match.params.id;
        app.post(project.SEARCH_PROJECT_BY_ID, {project_id:project_id}).then(result => {
            if (result.code === 1) {
                const data=result.data;
                //document.getElementById('detailContainer').innerHTML=data.project_content;
                _this.setState({project_name:data.project_name,detailContainer:data.project_content});
            } else {
                app.alert(result.msg, 'success', 2);
                _this.setState({project_name:'',detailContainer:''});
            }
        });
    }

    /**
     * 处理返回事件
     * @param num
     */
    handleRedirect(){
        this.props.history.goBack();
    }
}


export default prop=>(
    <Consumer>
        {
            props=>(
                <SuccessfulCase {...props} {...prop}/>
            )
        }
    </Consumer>
)